<template>
	<div v-loading="loading">
		<crumbs :title="'用户列表'"></crumbs>
		<div class="container" v-loading="loading2">
			<div class="handle-box">
				用户手机号：
				<el-input clearable v-model="select_word.phone" placeholder="请输入用户手机号" class="handle-input mr8"></el-input>
				用户名称：
				<el-input clearable v-model="select_word.username" placeholder="请输入用户名称" class="handle-input mr6"></el-input>
				机构名称：
				<el-input clearable v-model="select_word.organizationName" placeholder="机构名称" class="handle-input mr8"></el-input>
				用户类型：
				<el-select clearable filterable v-model="select_word.userType" placeholder="请选择用户类型" class="mr8">
					<el-option label="全部" value=""></el-option>
					<el-option v-for="(item, index) in userType" :key="index" :label="item.label" :value="item.value"></el-option>
				</el-select>
			</div>
			<div class="handle-box">
				来源平台：
				<el-select clearable filterable v-model="select_word.sourceChannel" placeholder="请选择用户类型" class="mr8">
					<el-option label="全部" value=""></el-option>
					<el-option v-for="(item, index) in sourceData" :key="index" :label="item.label" :value="item.value"></el-option>
				</el-select>
				 来源渠道：
				 <el-select clearable filterable v-model="select_word.sourceType" allow-create  default-first-option placeholder="请选择用户类型" class="mr8">
				 	<el-option label="全部" value=""></el-option>
				 	<el-option v-for="(item, index) in sourceType" :key="index" :label="item.label"  :value="item.value"></el-option>
				 </el-select>


			<!-- 	<el-input clearable v-model="select_word.sourceType" placeholder="来源渠道" class="handle-input mr8"></el-input> -->
				注册时间：
				<el-date-picker
					v-model="time"
					@change="changeTime"
					type="datetimerange"
					:picker-options="pickerOptions"
					range-separator="至"
					start-placeholder="开始日期"
					end-placeholder="结束日期"
					align="right"
				></el-date-picker>
				<el-button style="margin-left:20px" type="primary" icon="el-icon-search" @click="search">查询</el-button>
			</div>
			<el-table v-loading="$store.state.requestLoading" :data="allData" border ref="multipleTable">
				<el-table-column prop="id" label="用户编号" :show-overflow-tooltip="true" min-width="100" align="center"></el-table-column>
				<el-table-column prop="username" label="用户名称" :show-overflow-tooltip="true" min-width="150" align="center"></el-table-column>
				<el-table-column prop="sex" label="用户性别" align="center" min-width="100">
					<template slot-scope="scope">
						<span v-if="scope.row.sex === '男'">男</span>
						<span v-else-if="scope.row.sex === '女'">女</span>
					</template>
				</el-table-column>
				<el-table-column :show-overflow-tooltip="true" align="center" prop="userImgSrc" label="用户头像" min-width="150">
					<template slot-scope="scope">
						<el-popover placement="top-start" trigger="click">
							<a :href="scope.row.userImgSrc" target="_blank" title="查看图片">
								<img :src="scope.row.userImgSrc" style="min-width: 200px;height: 200px; cursor:pointer;" />
							</a>
							<img slot="reference" :src="scope.row.userImgSrc" style="width: 50px;height: 50px; cursor:pointer" />
						</el-popover>
					</template>
				</el-table-column>
				<el-table-column prop="userType" label="用户类型" min-width="120" align="center">
					<template slot-scope="scope">
						<span v-if="scope.row.userType == 'user'">普通用户</span>
						<span v-else>会员</span>
					</template>
				</el-table-column>
				<el-table-column prop="phone" label="手机号" min-width="120" align="center"></el-table-column>
				<el-table-column prop="sourceChannel" label="来源平台" min-width="120" align="center"></el-table-column>
				<el-table-column prop="sourceType" label="来源渠道" min-width="120" align="center">
					<template slot-scope="scope">
						<span v-if="scope.row.sourceType == 'regist'">自己注册</span>
						<span v-else-if="scope.row.sourceType == 'organization'">机构</span>
						<span v-else-if="scope.row.sourceType == 'friend'">好友邀请</span>
						<span v-else>{{ scope.row.sourceType }}</span>
					</template>
				</el-table-column>
				<el-table-column prop="sourceNameOrganization" label="来源机构" min-width="120" align="center"></el-table-column>
				<el-table-column prop="sourceNameUser" label="用户上级" min-width="120" align="center"></el-table-column>
				<el-table-column prop="money" label="学到币" min-width="120" align="center"></el-table-column>

				<el-table-column prop="moneySum" label="总消费金额" min-width="120" align="center"></el-table-column>
				<el-table-column prop="vipExpirationTime" label="会员到期时间" min-width="160" align="center">
					<template slot-scope="scope">
						<span>{{ scope.row.vipExpirationTime | change }}</span>
					</template>
				</el-table-column>
				<el-table-column prop="createTime" label="最近登录时间" min-width="160" align="center">
					<template slot-scope="scope">
						<span>{{ scope.row.createTime | change }}</span>
					</template>
				</el-table-column>
				<el-table-column prop="registerTime" label="注册时间" min-width="160" align="center">
					<template slot-scope="scope">
						<span>{{ scope.row.registerTime | change }}</span>
					</template>
				</el-table-column>
				<el-table-column prop="birthday" label="用户生日" min-width="160" align="center">
					<template slot-scope="scope">
						<span>{{ scope.row.birthday | change }}</span>
					</template>
				</el-table-column>
				<el-table-column prop="remarks" label="备注" min-width="250" :show-overflow-tooltip="true" align="center">
					<template slot-scope="scope">
						<span v-if="scope.row.remarks">
							<span v-if="scope.row.remarks.length < 25">
								<p>{{ scope.row.remarks }}</p>
							</span>
							<el-popover trigger="hover" placement="top" v-else>
								<p>{{ scope.row.remarks }}</p>
								<div slot="reference" class="name-wrapper">
									<p class="ellipsis">{{ scope.row.remarks | showRole }}</p>
								</div>
							</el-popover>
						</span>
					</template>
				</el-table-column>
				<el-table-column prop="status" label="用户状态" min-width="120" align="center">
					<template slot-scope="scope">
						<span v-if="scope.row.status == 'yes'">可正常登录</span>
						<span v-else-if="scope.row.status == 'no'">被停用</span>
						<span v-else></span>
					</template>
				</el-table-column>
				<el-table-column prop="learnTime" label="总学习时长(min)" min-width="160" align="center"></el-table-column>
				<el-table-column prop="conLearnDays" label="连续学习天数" min-width="120" align="center"></el-table-column>
				<el-table-column prop="lastLearnDays" label="停止学习天數" min-width="120" align="center"></el-table-column>
				<el-table-column label="操作" min-width="260" align="center" fixed="right">
					<template slot-scope="scope">
						<el-button type="text" icon="el-icon-edit" @click="cancellation(scope.row)">编辑</el-button>
						<el-button type="text" icon="el-icon-document" @click="examine(scope.row)">学到币</el-button>
						<el-button type="text" icon="el-icon-document" @click="freeCoupons(scope.row)">赠送优惠券</el-button>
						<!-- <el-button
              type="text"
              icon="el-icon-edit"
              style="color:#ff0000"
              v-if="scope.row.status == 'yes'"
              @click="prohibit(scope.row)"
              >停用
            </el-button>
            <el-button
              type="text"
              icon="el-icon-loading"
              v-else-if="scope.row.status == 'loading'"
              >更改中
            </el-button>
            <el-button
              type="text"
              icon="el-icon-edit"
              v-else
              @click="prohibit(scope.row)"
              >恢复
            </el-button> -->
					</template>
				</el-table-column>
			</el-table>
			<!-- 分页 -->
			<div class="pagination">
				<el-pagination
					@size-change="handleSizeChange"
					@current-change="handleCurrentChange"
					:page-sizes="[5, 10, 20, 50, 100]"
					:page-size="size"
					layout="total, sizes, prev, pager, next, jumper"
					:total="totals"
					:current-page="currentPage"
				></el-pagination>
			</div>
		</div>
		<!-- 修改 -->
		<el-dialog title="编辑" top="5vh" :visible.sync="editVisible" width="45%">
			<el-form :inline="true" ref="form" :model="updata" label-width="110px">
				<el-row :gutter="20" class="el-row">
					<el-col :span="12" class="el-col">
						<el-form-item
							label="用户名称:"
							prop="username"
							:rules="[
								{
									required: true,
									message: '该项不能为空',
									trigger: 'blur'
								}
							]"
						>
							<el-input v-model="updata.username"></el-input>
						</el-form-item>
						<el-form-item
							label="来源渠道"
							prop="sourceType"
							:rules="[
								{
									required: true,
									message: '该项不能为空',
									trigger: 'blur'
								}
							]"
						>
							<el-select style="width: 202px;" v-model="updata.sourceType" placeholder="请选择" @change="changeSourceId()">
								<el-option :label="item.label" :value="item.value" v-for="(item, index) in sourceType" :key="index"></el-option>
							</el-select>
						</el-form-item>
						<el-form-item label="用户上级" v-if="updata.sourceType == 'friend'">
							<el-select style="width: 202px;" v-model="updata.sourceId" filterable placeholder="请选择">
								<el-option :label="item.name" :value="item.id" v-for="(item, index) in userDropdownAll" :key="index"></el-option>
							</el-select>
						</el-form-item>
						<el-form-item label="用户生日:" prop="birthday">
							<el-date-picker format="yyyy-MM-dd" v-model="updata.birthday" type="date" placeholder="选择生日"></el-date-picker>
							<!-- <el-input v-model="updata.birthday"></el-input> -->
						</el-form-item>
						<el-form-item label="会员到期时间" prop="vipExpirationTime">
							<el-date-picker style="width:202px" v-model="updata.vipExpirationTime" type="datetime" placeholder="选择日期时间"></el-date-picker>
						</el-form-item>
					</el-col>
					<el-col :span="12" class="el-col">
						<el-form-item
							:rules="[
								{
									required: true,
									message: '该项不能为空',
									trigger: 'blur'
								}
							]"
							label="用户类型"
							prop="userType"
						>
							<el-select v-model="updata.userType" placeholder="请选择用户类型" filterable :key="updata.userType">
								<el-option :label="item.label" :value="item.value" v-for="(item, index) in userType" :key="index"></el-option>
							</el-select>
						</el-form-item>
						<el-form-item label="来源机构" v-if="updata.sourceType == 'organization'">
							<el-select v-model="updata.sourceId" placeholder="请选择" filterable :key="updata.sourceId">
								<el-option :label="item.name" :value="item.id" v-for="(item, index) in organizationDropdownAll" :key="index"></el-option>
							</el-select>
						</el-form-item>
						<el-form-item label="用户状态">
							<el-select v-model="updata.status" placeholder="请选择用户状态" filterable :key="updata.status">
								<el-option :label="item.label" :value="item.value" v-for="(item, index) in userStatus" :key="index"></el-option>
							</el-select>
						</el-form-item>
						<el-form-item label="用户性别:"><el-input style="width:217px" v-model="updata.sex"></el-input></el-form-item>
					</el-col>
					<el-col :span="24" class="el-col">
						<el-form-item label="备注" prop="remarks">
							<el-input
								style="width:106%"
								type="textarea"
								placeholder="请输入内容"
								:show-word-limit="true"
								:max="200"
								:maxlength="200"
								v-model="updata.remarks"
								:autosize="{ minRows: 5 }"
							></el-input>
						</el-form-item>
					</el-col>
				</el-row>
			</el-form>
			<div
				class="handle-box"
				style="width: 90%;
    margin: 0 auto;font-size:15px"
			>
				购买课程情况
			</div>
			<el-table v-loading="$store.state.requestLoading" :data="currimalArr" border ref="multipleTable" style="width: 90%; margin: 10px auto 0;">
				<el-table-column type="index" label="编号" :show-overflow-tooltip="true" width="150" align="center"></el-table-column>
				<el-table-column prop="curriculumName" label="课程名称" :show-overflow-tooltip="true" min-width="150" align="center"></el-table-column>
				<el-table-column prop="payMoney" label="购买价格" :show-overflow-tooltip="true" min-width="150" align="center"></el-table-column>
			</el-table>
			<!-- 分页 -->
			<div class="pagination">
				<el-pagination
					@size-change="handleSizeChange_curr"
					@current-change="handleCurrentChange_curr"
					:page-sizes="[5, 10, 20, 50, 100]"
					:page-size="size"
					layout="total, sizes, prev, pager, next, jumper"
					:total="curr.total"
					:current-page="curr.currentPage"
				></el-pagination>
			</div>
			<span slot="footer" class="dialog-footer">
				<el-button @click="editVisible = false">取 消</el-button>
				<el-button type="primary" :loading="$store.state.requestLoading" @click="ensure">确 定</el-button>
			</span>
		</el-dialog>
		<!-- 学到币 -->
		<el-dialog class="money" title="学到币" top="5vh" :visible.sync="detVisible2" width="35%">
			<el-row :gutter="5">
				<el-col :span="3"><el-button type="primary" :loading="$store.state.requestLoading" @click="showMoneySure">操作数量</el-button></el-col>
			</el-row>
			<el-table v-loading="loading" :data="currentView" style="width: 100%;margin-top: 10px;" border :row-class-name="tableRowClassName">
				<el-table-column prop="type" label="类型" min-width="120" align="center">
					<template slot-scope="scope">
						<span v-for="(item, index) in moneyType" :key="index">
							<span v-if="scope.row.type == item.value">{{ item.label }}</span>
						</span>
					</template>
				</el-table-column>
				<el-table-column prop="payMoney" label="数量" min-width="120" align="center"></el-table-column>
				<el-table-column prop="remark" label="备注" min-width="300" :show-overflow-tooltip="true" align="center"></el-table-column>
			</el-table>
			<div class="pagination">
				<el-pagination
					@size-change="handleSizeChange_Yue"
					@current-change="handleCurrentChange_Yue"
					:page-sizes="[5, 10, 20, 50, 100]"
					:page-size="size_Yue"
					layout="total, sizes, prev, pager, next, jumper"
					:total="totalCount"
					:current-page="currentPage_Yue"
				></el-pagination>
			</div>
		</el-dialog>
		<!-- 操作数量 -->
		<el-dialog class="money" title="操作数量" top="5vh" :visible.sync="editMoneyVisible" width="40%">
			<el-form ref="numForm" :model="updataMoney" label-width="100px">
				<el-row :gutter="5">
					<el-col :span="18">
						<el-form-item
							label="金额"
							prop="money"
							:rules="[
								{
									required: true,
									message: '该项不能为空',
									trigger: 'blur'
								}
							]"
						>
							<el-input type="number" v-model="updataMoney.money" placeholder="金额"></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="18">
						<el-form-item
							label="类型"
							prop="type"
							:rules="[
								{
									required: true,
									message: '该项不能为空',
									trigger: 'blur'
								}
							]"
						>
							<el-select style="width:100%" v-model="updataMoney.type" placeholder="请选择类型">
								<el-option label="官方扣除" value="adminspend"></el-option>
								<el-option label="官方赠送" value="adminobtain"></el-option>
							</el-select>
						</el-form-item>
					</el-col>
					<el-col :span="18">
						<el-form-item
							label="备注"
							prop="remark"
							:rules="[
								{
									required: true,
									message: '该项不能为空',
									trigger: 'blur'
								}
							]"
						>
							<el-input type="textarea" placeholder="请输入内容" v-model="updataMoney.remark" :autosize="{ minRows: 4 }"></el-input>
						</el-form-item>
					</el-col>
				</el-row>
			</el-form>
			<span slot="footer" class="dialog-footer">
				<el-button @click="editMoneyVisible = false">取 消</el-button>
				<el-button type="primary" :loading="$store.state.requestLoading" @click="moneySure('numForm')">确定</el-button>
			</span>
		</el-dialog>
		<!-- 赠送优惠券 -->
		<el-dialog title="赠送优惠券" top="5vh" :visible.sync="cuponsVisible" width="40%">
			<el-form :inline="true" ref="form" :model="updata" label-width="110px">
				<el-row :gutter="20" class="el-row">
					<el-col :span="20" class="el-col">
						<el-form-item
							label="优惠券名称"
							prop="sourceType"
							:rules="[
								{
									required: true,
									message: '该项不能为空',
									trigger: 'blur'
								}
							]"
						>
							<el-select style="width: 202px;" v-model="couponsId" filterable placeholder="请输入优惠券名称">
								<el-option :label="item.id + ' : ' + item.name" :value="item.id" v-for="(item, index) in CouponsArr" :key="index"></el-option>
							</el-select>
						</el-form-item>
					</el-col>
				</el-row>
			</el-form>
			<span slot="footer" class="dialog-footer">
				<el-button @click="cuponsVisible = false">取 消</el-button>
				<el-button type="primary" :loading="$store.state.requestLoading" @click="sureCoupons">确 定</el-button>
			</span>
		</el-dialog>
	</div>
</template>
<script>
import crumbs from '../../views/Crumbs.vue';

export default {
	name: '',
	components: {
		crumbs
	},
	data() {
		return {
			loading: true,
			editMoneyVisible: false,
			cuponsVisible: false,
			currimalArr: [],
			CouponsArr: [],
			curr: {
				total: 0,
				currentPage: 1,
				pageSize: 5
			},
			//搜索关键词
			select_word: {
				username: '',
				organizationName: '',
				register: '',
				birthday: '',
				phone: '',
				userType: '',
				timeStart: null,
				timeEnd: null,
				sourceChannel:'',
				sourceType:'',
			},
			sourceData:[
				{label:'app',value:'app'},
				{label:'h5',value:'h5'},
				{label:'小程序',value:'program'},
			],
			pickerOptions: {
				shortcuts: [
					{
						text: '最近一周',
						onClick(picker) {
							const end = new Date();
							const start = new Date();
							start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
							picker.$emit('pick', [start, end]);
						}
					},
					{
						text: '最近一个月',
						onClick(picker) {
							const end = new Date();
							const start = new Date();
							start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
							picker.$emit('pick', [start, end]);
						}
					},
					{
						text: '最近三个月',
						onClick(picker) {
							const end = new Date();
							const start = new Date();
							start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
							picker.$emit('pick', [start, end]);
						}
					}
				]
			},
			time: '',
			userStatus: [
				{
					label: '正常',
					value: 'yes'
				},
				{
					label: '停用',
					value: 'no'
				}
			],
			userType: [
				{
					label: '会员用户',
					value: 'vip'
				},
				{
					label: '普通用户',
					value: 'user'
				}
			],
			moneyType: [
				{
					label: '充值',
					value: 'recharge'
				},
				{
					label: '任务获得',
					value: 'obtain'
				},
				{
					label: '消费',
					value: 'spend'
				},
				{
					label: '官方扣除',
					value: 'adminspend'
				},
				{
					label: '官方赠送',
					value: 'adminobtain'
				}
			],
			//数据
			allData: null,
			//总页数
			totals: null,
			currentPage: 1,
			//每页的数据
			size: 5,
			//查看全部按钮
			detVisible2: false,
			//当前查看的数据
			currentView: null,
			//搜索条件
			value: 'username',
			//搜索时间
			searchTime: [],
			editVisible: false,
			updata: {
				// id: "",
				// sourceType: "",
				// sourceId: "",
				// username: "",
				// userType: "",
				// vipExpirationTime: "",
				// remarks: "",
				id: '', //用户id
				sourceType: '', //用户来源类型 组织:organization,好友邀请:friend,自己注册:regist
				sourceId: '', //用户来源关联id
				username: '', //用户名称
				userType: '', //用户类型：普通用户：user，vip用户：vip
				score: '', //要增加或者减少的积分数量
				scoreType: '', //积分类型：获取obtain 消费spend
				sex: '', //用户性别
				scoreRemarks: '', //更改积分的备注
				vipExpirationTime: '', //会员到期时间
				remarks: '' //用户的备注
			},
			updataMoney: {
				userId: '',
				money: '',
				type: '',
				remark: ''
			},
			loading2: true,
			sourceType: [
				{
					label: '机构',
					value: 'organization'
				},
				{
					label: '好友邀请',
					value: 'friend'
				},
				{
					label: '自己注册',
					value: 'regist'
				}
			],
			organizationDropdownAll: null,
			userDropdownAll: null,
			//积分记录
			editVisible2: true,
			totalCount: null,
			currentPage_Yue: 1,
			size_Yue: 5,
			couponsId: null,
			userId: null
		};
	},
	created() {
		this.getusersListAll();
		this.getOrganizationDropdown();
		this.getUserDropdown();
	},
	methods: {
		//搜索
		search() {
			this.loading2 = true;
			this.currentPage = 1;
			this.getusersListAll();
		},
		changeSourceId() {
			this.updata.sourceId = null;
		},
		getusersListAll(arr) {
			this.$axios
				.getusersListAll({
					pageSize: this.size,
					pageNo: this.currentPage,
					username: this.select_word.username,
					organizationName: this.select_word.organizationName,
					phone: this.select_word.phone,
					userType: this.select_word.userType,
					timeStart: this.select_word.timeStart,
					timeEnd: this.select_word.timeEnd,
					timeType: this.select_word.timeStart == null ? '' : 'register',
					sourceChannel:this.select_word.sourceChannel,
					sourceType:this.select_word.sourceType,
				})
				.then(res => {
					this.loading2 = false;
					this.loading = false;
					if (res.success) {
						this.totals = res.data.total;
						this.allData = res.data.records;
					}
				});
		},
		handleSizeChange(item) {
			this.loading2 = true;
			this.size = item;
			this.getusersListAll();
		},

		handleCurrentChange(item) {
			this.loading2 = true;
			this.currentPage = item;
			this.getusersListAll();
		},
		handleSizeChange_Yue(item) {
			this.size_Yue = item;
			this.getMoney();
		},
		handleCurrentChange_Yue(item) {
			this.currentPage_Yue = item;
			this.getMoney();
		},
		handleSizeChange_curr(val) {
			this.curr.pageSize = val;
			this.getCurr();
		},
		handleCurrentChange_curr(val) {
			this.curr.currentPage = val;
			this.getCurr();
		},
		// 点击学到币
		examine(item) {
			console.log(item);
			for (let key in this.updataMoney) {
				this.updataMoney[key] = item[key];
			}
			this.updataMoney = {
				userId: item.id,
				money: '',
				type: '',
				remark: ''
			};
			this.currentPage_Yue = 1;
			console.log('学到币', this.updataMoney);
			this.getMoney();
		},
		// 赠送优惠券
		freeCoupons(item) {
			this.couponsId = null;
			this.cuponsVisible = true;
			this.userId = item.id;
			this.getCoupons();
		},
		getMoney() {
			this.loading = true;
			this.$axios
				.moneyQueryByUserId({
					userId: this.updataMoney.userId,
					pageSize: this.size_Yue,
					pageNo: this.currentPage_Yue
				})
				.then(res => {
					console.log('余额', res.data);
					this.currentView = res.data.records;
					this.totalCount = res.data.total;
					this.detVisible2 = true;
					this.loading = false;
				});
		},
		//改变时间格式
		changeTime(item) {
			let time = new Date(item);
			let hours = time.getHours().toString().length > 1 ? time.getHours() : '0' + time.getHours();
			let Seconds = time.getSeconds().toString().length > 1 ? time.getSeconds() : '0' + time.getSeconds();
			let Minutes = time.getMinutes().toString().length > 1 ? time.getMinutes() : '0' + time.getMinutes();
			let nowTime = time.getFullYear() + '-' + (time.getMonth() * 1 + 1) + '-' + time.getDate() + ' ' + hours + ':' + Minutes + ':' + Seconds;
			return nowTime;
		},
		//修改按钮
		cancellation(item) {
			/* console.log(item);
      for (let key in this.updata) {
        this.updata[key] = item[key];
        this.editVisible = true;
      } */
			this.updata = item;
			this.userId = item.id;
			this.editVisible = true;
			this.getCurr();
			console.log(this.updata);
		},
		//机构下拉选数据加载
		getOrganizationDropdown() {
			this.$axios.getOrganizationDropdown().then(res => {
				// console.log(res);
				this.organizationDropdownAll = res.data;
			});
		},
		//用户下拉选数据加载
		getUserDropdown() {
			this.$axios.getUserDropdown().then(res => {
				this.userDropdownAll = res.data;
			});
		},
		//停用/恢复用户
		prohibit(item) {
			let [status, status2] = ['停用', 'no'];
			if (item.status == 'no') {
				status = '恢复';
				status2 = 'yes';
			}
			this.$confirm(`此操作将${status}该用户, 是否继续?`, '提示', {
				confirmButtonText: '确定',
				cancelButtonText: '取消',
				type: 'warning'
			})
				.then(() => {
					item.status = 'loading';
					this.$axios
						.prohibitUser({
							id: item.id,
							status: status2
						})
						.then(res => {
							if (res.success) {
								this.$message({
									type: 'success',
									message: `${status}成功!`
								});
							}
							item.status = status2;
						});
				})
				.catch(() => {
					this.$message({
						type: 'info',
						message: `已取消${status}`
					});
					this.loading2 = false;
				});
		},
		//确定
		ensure() {
			this.$refs.form.validate(valid => {
				if (valid) {
					this.loading2 = true;
					this.editVisible = false;
					if (this.updata.vipExpirationTime != null) {
						this.updata.vipExpirationTime = this.formatTimes(this.updata.vipExpirationTime);
					}
					this.$axios.changeUser({ ...this.updata }).then(res => {
						if (res.success) {
							this.$message({
								message: '修改成功',
								type: 'success'
							});

							this.loading2 = false;
							this.getusersListAll();
						}
					});
				} else {
					console.error('error submit!!');
					return false;
				}
			});
		},
		showMoneySure() {
			this.updataMoney = {
				userId: this.updataMoney.userId,
				money: '',
				type: '',
				remark: ''
			};
			this.editMoneyVisible = true;
		},
		moneySure(formName) {
			this.$refs[formName].validate(valid => {
				if (valid) {
					this.$axios
						.moneyUpdUserMoney({
							userId: this.updataMoney.userId,
							money: this.updataMoney.money,
							type: this.updataMoney.type,
							remark: this.updataMoney.remark
						})
						.then(res => {
							if (res.success) {
								this.$message({
									message: '修改成功',
									type: 'success'
								});
								this.getMoney(this.updataMoney.userId);
								this.editMoneyVisible = false;
							}
						});
				} else {
					console.log('error submit!!');
					return false;
				}
			});
		},
		getCurr() {
			this.$axios
				.userQueryUserOrder({
					userId: this.userId,
					pageNo: this.curr.currentPage,
					pageSize: this.curr.pageSize
				})
				.then(res => {
					console.log(res);
					this.currimalArr = res.data.records;
					this.curr.total = res.data.total;
				});
		},
		getCoupons() {
			this.$axios.couponsDetailsQueryCouponsName({}).then(res => {
				this.CouponsArr = res.data;
			});
		},
		sureCoupons() {
			console.log(this.userId, this.couponsId);
			this.$axios
				.couponsDetailsExchangeCoupon({
					userId: this.userId,
					id: this.couponsId
				})
				.then(res => {
					if (!res.success) {
						this.$message.error(res.msg);
						return;
					}
					this.$message.success(res.msg);
					this.cuponsVisible = false;
					this.getusersListAll();
				});
		},
		//修改时间格式
		reformat(item) {
			if (!item) return;
			let time = new Date(item);
			let hours = time.getHours().toString().length > 1 ? time.getHours() : '0' + time.getHours();
			let Seconds = time.getSeconds().toString().length > 1 ? time.getSeconds() : '0' + time.getSeconds();
			let Minutes = time.getMinutes().toString().length > 1 ? time.getMinutes() : '0' + time.getMinutes();
			return time.getFullYear() + '-' + (time.getMonth() * 1 + 1) + '-' + time.getDate() + ' ' + hours + ':' + Minutes + ':' + Seconds;
		},
		tableRowClassName({ row, rowIndex }) {
			if (row.type == 'obtain') return 'warning-row';
		},
		changeTime(time) {
			this.select_word.timeStart = time ? this.formatTimes(time[0]) : null;
			this.select_word.timeEnd = time ? this.formatTimes(time[1]) : null;
			// this.select_word.timeEnd=this.formatTimes(time[1])
			console.log(this.select_word);
		}
	},
	watch: {
		updata: {
			handler(oldSourceType, newSourceType) {
				console.log(oldSourceType, newSourceType);
			}
		}
	},
	mounted() {
		//   console.log(this.time)
		// this.getOrganizationDropdown()
	},
	filters: {
		//改变时间格式
		change(item) {
			if (!item) return '暂无';
			let time = new Date(item);
			let hours = time.getHours().toString().length > 1 ? time.getHours() : '0' + time.getHours();
			let Seconds = time.getSeconds().toString().length > 1 ? time.getSeconds() : '0' + time.getSeconds();
			let Minutes = time.getMinutes().toString().length > 1 ? time.getMinutes() : '0' + time.getMinutes();
			return time.getFullYear() + '-' + (time.getMonth() * 1 + 1) + '-' + time.getDate() + ' ' + hours + ':' + Minutes + ':' + Seconds;
		},
		showRole(val) {
			if (!val) return val;
			let str;
			if (val.length >= 25) {
				str = val.substr(0, 25) + '......';
			} else {
				return val;
			}
			return str;
		}
	}
};
</script>
<style scoped>
.handle-box {
	margin-bottom: 20px;
}

.handle-input {
	width: 200px;
	display: inline-block;
	margin-right: 10px;
}

.crumbs {
	margin: 10px 0;
}

.mr10 {
	margin-right: 10px;
}

.handle-select {
	width: 120px;
}

.container {
	padding: 30px;
	background: #fff;
	border: 1px solid #ddd;
	border-radius: 5px;
}

#Detail p {
	font-size: 28px;
	font-weight: 500;
	text-align: center;
	padding-bottom: 21px;
}

#Detail ul {
	width: 90%;
	margin: 0 7%;
	display: flex;
	flex-wrap: wrap;
}

#Detail li {
	list-style: none;
	width: 40%;
	margin: 20px 5%;
	float: left;
	/* padding: 25px 0px 30px 124px; */
}

#Detail li > span:nth-child(1) {
	font-size: 18px;
	font-weight: 600;
}

#Detail li > span:nth-child(2) {
	width: 327px;
	min-width: 327px;
	padding: 0 8px;
	border-radius: 5px;
	font-size: 20px;
	font-weight: 500;
}

#Detail li:last-child img {
	/* width: 90%; */
	min-width: 45%;
	height: 150px;
	margin: 0 auto;
	display: block;
}

#Detail .spans span {
	padding: 0 5px;
}

.money /deep/ .el-dialog__footer {
	margin-top: 20px;
	/* 这个起作用 */
}
</style>
